<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>


    <meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
	<title>Bootstrap 101 Template</title>

	<!-- Bootstrap -->
	<link href="__CSS__/bootstrap.min.css" rel="stylesheet">
	<link rel="stylesheet" href="__CSS__/my.css">
	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
	<script src="http://cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	<script src="http://cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script>
	<![endif]-->
	<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
	<script src="__JS__/jquery.min.js"></script>
	<!-- Include all compiled plugins (below), or include individual files as needed -->
	<script src="__JS__/bootstrap.min.js"></script>
	
</head>
<body>

      <div class="container">
      	 <div class="col-md-12 bg-primary p10">
      	 	<h6>歌手列表</h6>
      	 	<hr>
      	 
           
					  <button class="btn btn-default" data-toggle="modal" data-target="#myModal">
						 歌手添加
					  </button>
                      
					  <!-- 模态框（Modal） -->
					  <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
						  <div class="modal-dialog">
							  <div class="modal-content">
								  <div class="modal-header">
									  <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
										  &times;
									  </button>

										  <div class="alert alert-success" role="alert">
											  <h4 class="modal-title  bg-success" id="myModalLabel">
										歌手添加
											  </h4>
										  </div>
								   </div>

								 <form class="form-horizontal" action="{:url('admin/Singers/add')}" method='post' enctype="multipart/form-data" name="form1">
									
						                <div class="modal-body">

						                    <table class="table table-bordered" style="color:black">
						                        <tr>
						                            <td>歌手名字</td>
						                            <td><input type="text" name='name'></td>
						                        </tr>
						                        <tr>
						                            <td>歌手地址</td>
						                            <td><input type="text" id='singer' name='address' value=""></td>
						                        </tr>
						                        <tr>
						                        	<td>粉丝数量</td>
						                        	<td><input type="text" name="num"></td>
						                        </tr>

						                        <tr>
						                        	<td>歌手类型</td>
						                        	<td><select name="style" >
						                        		<option value="">华语</option>
						                        		<option value="华语男歌手">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;华语男歌手</option>
						                        	    <option value="华语女歌手">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;华语女歌手</option>
						                        	    <option value="华语组合">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;华语组合</option>

						                        	    <option value="">港台</option>
						                        		<option value="港台男歌手">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;港台男歌手</option>
						                        	    <option value="港台女歌手">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;港台女歌手</option>
						                        	    <option value="港台组合">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;港台组合</option>

						                        	    <option value="">韩国</option>
						                        		<option value="韩国男歌手">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;韩国男歌手</option>
						                        	    <option value="华语女歌手">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;韩国女歌手</option>
						                        	    <option value="韩国组合">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;韩国组合</option>

						                        	    <option value="">日本</option>
						                        		<option value="日本男歌手">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;日本男歌手</option>
						                        	    <option value="日本女歌手">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;日本女歌手</option>
						                        	    <option value="日本组合">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;日本组合</option>

						                        	    <option value="">其他</option>
						                        		<option value="其他男歌手">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;其他男歌手</option>
						                        	    <option value="其他女歌手">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;其他女歌手</option>
						                        	    <option value="其他组合">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;其他组合</option>






						                        	 
						                        	    </select>
						                        	</td>
						                        </tr>

						                        <tr>
						                            <td>性别</td>
						                            <td>
						                                <input type="radio" name='sex' value='0'> 男
						                                <input type="radio" name='sex' value='1'> 女
						                       
						                            </td>
						                        </tr>
						                        <tr>
						                            <td>图片</td>
						                            <td>  <input type="file" class="file" name="image" >
                                                </td>
						                        </tr>
						                        
						                        <tr>
						                            <td>详情</td>
						                            <td>
						                                <textarea name="dex" id="" cols="30" rows="10" ></textarea>
						                            </td>
						                        </tr>
						                    </table>



						                </div>
						                <div class="modal-footer">
						                    <button type="button" class="btn btn-default" data-dismiss="modal">关闭
						                    </button>
						                    <button class="btn btn-primary " type='submit' >
						                        保存
						                    </button>
						                </div>
						            </form>

							  </div><!-- /.modal-content -->
						  </div><!-- /.modal -->
					  </div>


					

            
      	 </div>

      	 <div class="clearfix"></div>

      	 <div class="col-md-12">
      	 	<table class="table table-hover bg-info">
      	 		<tr>
      	 			<th>ID</th>
      	 			<th>名字</th>
      	 			<th>性别</th>
      	 			<th>详情</th>
      	 			<th>地址</th>
      	 			<th>图片</th>
      	 			<th>粉丝</th>
      	 			<th>类型</th>
      	 			<th>操作</th>
      	 		</tr>
      	 		{foreach $list as $v}
                <tr>
                	<td>{$v['id']}</td>
                    <td>{$v['name']}</td>
                   <td>{if $v['sex']==0 }
                      男
                      {else  $v['sex']==1} 
                      女
                  
                     
	                {/if}
	                </td>
                    <td>{$v['dex']}</td>
                    <td>{$v['address']}</td>
                    <td><img src="__UPLOAD__{$v.icon}" style="width:80px;height:80px"></td>
                    <td>{$v['num']}</td>
                    <td>{$v['style']}</td>
                    <td class="col-md-2">
                    	
                    	<a href="{:url('admin/Singers/edit',['id'=>$v['id']])}" class="btn btn-primary btn-xs">编辑</a>
                        <button data-id="{$v['id']}" class="btn btn-danger btn-xs del-btn" >删除</button>
                    </td>
                </tr>

      	 		{/foreach}
      	 	</table>
      	 </div>
		<div>
		    {$list->render()}
		</div>	
      </div>


      <script>
      	$(function(){
            //触发用户删除
            $('.del-btn').click(function(){
             var ac_id = $(this).attr('data-id');
            if (confirm('您确定要[删除]该歌手么?')) {

            	var obj = $(this).parents('tr');
            	delAjax(ac_id,obj);//执行删除操作
            }

            

            })



            

      	});

      	function delAjax(id,obj)
      	{
      	  $.ajax({
      	  	type:'delete',
      	  	url:'/admin/Singers/delete/id/' + id,
      	  	// dateType:'json',

      	  	success:function(data){
              if (data.status) {
                 alert('删除成功!!!');
                 obj.remove();
              }else{
                 alert('删除失败!!!');
              }
      	  	},

      	  	error:function(){
      	  		//Ajax执行失败
      	  		alert('Ajax执行失败')
      	  	}

      	  });
      	}

      </script>
	
</body>
</html>